import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import postCssPxToRem from 'postcss-pxtorem'
import autoprefixer from 'autoprefixer'
import { resolve } from "path";
// 自动导入vue中hook reactive ref等
import AutoImport from "unplugin-auto-import/vite"
//自动导入ui-组件 比如说vant等
import Components from 'unplugin-vue-components/vite';
import { VantResolver } from 'unplugin-vue-components/resolvers'
 
export default defineConfig({
	base: './',
	plugins: [
		vue(),
		AutoImport({
			//安装两行后你会发现在组件中不用再导入ref，reactive等
			imports: ['vue', 'vue-router', 'pinia'],
      //存放的位置
			dts: "src/auto-import.d.ts",
		}),
		Components({
			// 引入组件的,包括自定义组件
			resolvers: [VantResolver()],
			// 存放的位置
			dts: "src/components.d.ts",
		}),
	],
	css: {
    postcss: {
      plugins: [
        postCssPxToRem({
          rootVlaue: 16,
          propList: ['*']
        }),
        autoprefixer({
          overrideBrowserslist: [
            "Android 4.1",
            "iOS 7.1",
            "Chrome > 31",
            "ff > 31",
            "ie >= 8"
          ],
          grid: true
        })
      ]
    }
  },
	server: {
    proxy: {
      '/api': {
        target: 'https://XXXXXXXXXXXXX',
        changeOrigin: true,
        rewrite: path => path.replace(/^\/api/, '')
      }
    }
  },
	resolve: {
		// ↓路径别名
		alias: {
			"@": resolve(__dirname, "./src")
		}
	}
})